<template>
  <div id="filter-rule">
      <v-header title="过滤器规则" :showDownloadBtn = "download" :saveShow = "save"></v-header>
    <div class="main-cont" style="padding:0px 10px">
      <!-- <iToolbar v-on:click="handleToolClick" :buttonsObj="buttonsObj"></iToolbar> -->
      <el-container>
        <el-main>
          <el-table  :data="tableData">
            <el-table-column type="index" width="50"></el-table-column>
            <el-table-column prop="filterName" label="过滤器名称"></el-table-column>
            <el-table-column prop="filterCode" label="过滤器编号"></el-table-column>
            <el-table-column label="过滤器类型">
              <template slot-scope="scope">
                {{ filterType[scope.row.filterType] }}
              </template>
            </el-table-column>
            <el-table-column prop="createTime" label="创建时间">
            </el-table-column>
          </el-table>
          <el-pagination
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-size="pageSize"
            layout="total, prev, pager, next"
            :total="total">
          </el-pagination>
        </el-main>
      </el-container>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  import { gateWay } from '../../dict/rule-dict'
  import ajax from '../../../../api/ajax/ajax'
  import api from '../../../../api/url'
  import {VHeader} from '../../../../components'
  import { getDateTime } from '../../../../assets/js/index'
  export default {
    name: 'filter-rule',
    components: {
      VHeader
    },
    data () {
      return {
        tableData: [],
        total: 0,
        gateWay: {},
        download: false,
        save: false,
        pageSize: 10,
        currentPage: 1
      }
    },
    methods: {
      // 获取果过滤规则数据
      getAllFilter (pageNum = 1, pageSize = 10) {
        ajax.post(api.LISTAPIFILTER + '?pageNum=' + pageNum + '&pageSize=' + pageSize, {}).then(res => {
          if (res.list.length > 0) {
            this.total = res.total
            this.pageSize = res.pageSize
            let ruleArr = res.list
            let changeArr = []
            ruleArr.forEach((item, key) => {
              item.createTime = getDateTime(new Date(item.createTime), 'ss')
              changeArr.push(item)
            })
            this.tableData = changeArr
            this.currentPage = pageNum
          }
        }).catch(() => {})
      },
      handleCurrentChange (val) {
        this.getAllFilter(val)
      }
    },
    created () {
      // this.gateWay = gateWay
      this.getAllFilter()
    },
    computed: {
      filterType () {
        return gateWay.filterType
      }
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus">
#filter-rule
  height 100%
  .main-cont
    width 100%
    height calc(100% - 62px)
    overflow: auto
    overflow-x hidden
    padding 10px
</style>
